Next.js Static Web App deploy from Azure DevOps pipelines

I will do a few questions in the same body because they all share the same context.

I have a website that was using React.js and now we have made the migration to use Next.js, the reason for that is that we have a few "courses" pages and we want it to be found by google, to do so we need to implement the SSG ( Static Site Generation ), but those pages will be updated from times to times, it may be like 200 courses a day or none, so we are trying to use the ISR( Incremental Static Regeneration ) to pre-render the page, this way our static files will always be up to date, it is not clear yet how long will be the revalidate prop though, but doesn't really matter.

We are using azure DevOps for everything, so no GitHub Actions for now (this tutorial is for GitHub Repos).

With this in mind, it is clear that we have a Hybrid request (with the prop "is_static_export" unset), you guys have a tutorial that sadly didn't work for me.

1 - I have a .yaml with the following job

this Job is not working and it is returning this message:

Failed to find a default file in the app artifacts folder (.next). Valid default files: index.html,Index.html.

Tried a few fixes but none of them did the trick.

2 - The second problem

My first attempt was to use the out folder as part of the deployment, so I had the following .yaml job

This deployment is actually working fine, but it is a static deployment based on the export method command line "build": "next build && next export", as the documentation says it is only static stuff.

In this scenario, I didn't manage to read environment variables from the Static Web App, which doesn't work as I need to touch some external endpoints and use secrets, is it possible to do that? how does it work? does the Static Web App using the 'out' folder reads the env vars in any way?

Sorry about the long question, I am kinda stuck here.